<template>
    <div class="view" >
        <iframe :id="windowId" class="iframe" :windowId="windowId"  ref="iframe" frameborder="0" :src="src" width="100%" height="100%"></iframe>
        <div v-if="sizeMoving||moving" class="mask" style="width:100% ;height: 100%;">

        </div>
    </div>
</template>

<script>
    export default {
        name: "viewIframe",
        props:{
            moving:Boolean,
            sizeMoving:Boolean,
            src:String,
            windowId:{
                type:Number,
                required:true
            }
        },
        data() {
            return {
                // src: "",
                timer:null,
            }
        },
        methods: {
        },
        created() {

        },
        mounted() {
            // this.timer=window.setInterval(()=>{
            //     this.$emit("changeTitle",this.$refs.iframe.contentDocument.title)
            // },500)
            // this.src="/Test.html"
        },
        destroyed() {
            console.log("destroyed")
            // window.clearInterval(this.timer)
        }
    }
</script>

<style scoped>
    .view {
        height: calc(100% - 25px);
        /*height: 100%;*/
        width: calc(100% - 10px);
        margin-left: 5px;
        background-color: cadetblue;
        position: relative;
    }
    .iframe{
        position: absolute;
    }
    .mask{
        position: absolute;

    }

</style>